[CloudFront] Lambda@EdgeでHTTPセキュリティヘッダーを追加する方法
Lambda@EdgeはAmazon CloudFrontの機能で、CloudFrontのイベントに応じてLambda関数を実行できます。この機能を利用して、CloudFrontで配信しているコンテンツのレスポンスヘッダーにHTTPセキュリティヘッダーを設定します。
HTTPセキュリティヘッダーは、Webブラウザのセキュリティ対策のためにWebアプリで使用されるHTTPヘッダーです。HTTPセキュリティヘッダーを設定することで、クリックジャッキングやクロスサイトスクリプティング(XSS)など、クライアント側の脆弱性を利用した攻撃を困難にします。
Lambda@Edgeの仕組み
Lambda@Edgeはオリジのレスポンスをトリガーにした場合、CloudFrontがオリジンから取得したコンテンツをキャッシュする前に、コンテンツ内容をカスタマイズすることができます。
Lambda@Edgeの設定方法
Lambda@EdgeでHTTPセキュリティヘッダーを設定する手順を説明します。
Lambda関数を作成
Lambda@Edgeを設定するためには、us-east-1(バージニア北部)リージョンを選択する必要があります。リージョンが正しいことを確認して、任意の関数名でLambda関数を作成します。
実行ロールにはポリシーテンプレートから「基本的なlambda@Edgeのアクセス権限」を選択してください。
次のソースコードはNode.jsでの実装サンプルになります。
"use strict"; exports.handler = (event, context, callback) => { const response = event.Records[0].cf.response; const headers = response.headers; headers["strict-transport-security"] = [ { key: "Strict-Transport-Security", value: "max-age=63072000; includeSubdomains; preload" } ]; headers["content-security-policy"] = [ { key: "Content-Security-Policy", value: "default-src 'none'; img-src 'self'; script-src 'self'; style-src 'self'; object-src 'none'" } ]; headers["x-content-type-options"] = [ { key: "X-Content-Type-Options", value: "nosniff" } ]; headers["x-frame-options"] = [ { key: "X-Frame-Options", value: "DENY" } ]; headers["x-xss-protection"] = [ { key: "X-XSS-Protection", value: "1; mode=block" } ]; headers["referrer-policy"] = [ { key: "Referrer-Policy", value: "same-origin" } ]; callback(null, response); };
Lambda@Edgeへのデプロイ
Lambda関数のトリガーにCloudFrontを設定します。
Lambda@Edgeへのデプロイをクリックします。
CloudFrontのディストリビューションを選択します。HTTPレスポンスヘッダーをカスタマイズする場合、CloudFrontイベントはオリジンレスポンスを選択します。
動作確認
CloudFrontのディストリビューションのステータスがDeployedになるまで待ちます。
Webサイトを表示して、ブラウザのデバッグツールで、レスポンスヘッダーが追加されていることを確認できればOKです。
Mozilla ObservatoryでWebサイトの評価を確認することもできます。評価は必ずしもコンテンツの安全性を示すものではありませんが、脆弱性を改善するための目安になると思います。
まとめ
Lambda@Edgeを使用することで、オリジンを変更せず簡単にHTTPセキュリティヘッダーを追加することができました。アクセス数の多いサイトに導入する際には、Lambda@Edgeのクォータについても確認してみてください。